import React from "react";
import PropTypes from "prop-types";
import { mid2Url } from "@ali/ding-mediaid";
import { List } from "@ali/ding-ui";

// components
import Avatar from "../Avatar/";

// less
import "./profileLink.less";

// 为了有点击的效果，打算加入list item
const Item = List.Item;

const ProfileLink = ({ username, userId, corpId, avatar, ...props }) => (
  <div
    className="profile-link"
    onClick={() => {
      {
        dd.biz.util.open({
          name: "profile",
          params: { id: userId, corpId },
          onSuccess: function() {
            console.info("open profile success");
          },
          onFail: function(err) {
            console.error("open profile fail", err);
          }
        })
      }
    }}
  >
    <Avatar
      name={username}
      size=""
      avatar={avatar && mid2Url(avatar, { imageSize: "thumb" })}
      className="growth-avatar-dd-avatar"
      font=""
    >
      {avatar && (
        <div className="profile-link-username">
          {username}
          {props.children}
        </div>
      )}
    </Avatar>
    {!avatar && (
      <div className="profile-link-username name-with-avatar">
        {username}
        {props.children}
      </div>
    )}
  </div>
);

ProfileLink.defaultProps = {
  username: ""
};
ProfileLink.propTypes = {
  username: PropTypes.string,
  userId: PropTypes.string,
  corpId: PropTypes.string,
  avatar: PropTypes.string
};
export default ProfileLink;
